<style>
  select {
    background: #fff !important;
  }
  .InfostDiv input,
  .InfostDiv select {
    width: 70% !important;
    /*color:black !important;*/
  }
  
  .InfostDiv input::placeholder{color: black !important;}
  #gradualBg.gradualBg {
    background: #d5d5d5 !important;
  }
  #gradualBg.u-high {
    background: linear-gradient(to right, #ff9c1e, #ff7300) !important;
  }
  .am-fl{color:black;}

  .kutup{height: 2.3rem;overflow: hidden;border-radius: 0.1rem;}
</style>
<div class="CommonHeader">
  <div class="CommonBackBtn">
    <a href="javascript:void(0) " onclick="onc()"
      ><img src="__CDN__/map/images/return_black.png" alt="返回"
    /></a>
  </div>
  <div class="CommonTitle">开通商家</div>
</div>

<div class="CommonMain" id="CommonMain2">
  <div class="InfosBox ">
    <div class="InfostDiv am-cf">
      <span class="am-fl">店名称</span>
      <input
        class="am-fl"
        type="text"
        name="name"
        value="{$shop.name}"

        {if condition="$shop.status eq 0"}  readonly="readonly" {/if}

        placeholder="请输入"
      />
    </div>
    <div class="InfostDiv am-cf">
      <span class="am-fl">店简介</span>
      <input
        class="am-fl"
        type="text"
        name="desc"
        value="{$shop.desc}"

        {if condition="$shop.status eq 0"}  readonly="readonly" {/if}

        placeholder="请输入"
      />
    </div>
    <div class="InfostDiv am-cf">
      <span class="am-fl">行业</span>
      <select name="category_id">
        <option value="0">请选择</option>
        {$category}
      </select>
      <p class="img"><img src="__CDN__/map/images/arrow_right.png" /></p>
    </div>
    <input type="hidden" name="user_card_on" value="{$shop.name}" />
    <input type="hidden" name="user_card_back" value="{$shop.user_card_back}" />
    <input type="hidden" name="license" value="{$shop.license}" />
    <input type="hidden" name="shop_image" value="{$shop.shop_image}" />
    <input type="hidden" name="shop_id" value="{$shop.id}" />
    <div class="InfostDiv am-in">
      <span class="am-fl">省选择</span>
      <select id="addarea_sheng" class="am-fl" name="province" ;>
        {$option.prov}
      </select>
    </div>
    <div class="InfostDiv am-in">
      <span class="am-fl">市选择</span>

      <select id="addarea_shi" class="am-fl" name="city">
        {$city_id}
      </select>
    </div>
    <div class="InfostDiv am-in">
      <span class="am-fl">地区选择</span>

      <select id="addarea_quxian" class="am-fl" name="area">
        {$region_id}
      </select>
    </div>
    <div class="InfostDiv am-cf">
      <span class="am-fl">地址</span>
      <input
        class="am-fl"
        name="address"
        value="{$shop.address}"
        type="text"

        {if condition="$shop.status eq 0"}  readonly="readonly" {/if}
        placeholder="请选择"
      />
      <p class="img"><img src="__CDN__/map/images/arrow_right.png" /></p>
    </div>

    <div class="InfostDiv am-cf">
      <span class="am-fl">资质</span>
      <input id="cok" class="am-fl" type="text" placeholder="资质" readonly />
      <p class="img"><img src="__CDN__/map/images/arrow_right.png" /></p>
    </div>
    <div class="InfostDiv am-cf">
      <span class="am-fl">店描述</span>
    </div>
    <div class="ComplainTextareaBox">
      <div class="ComplainTextarea">
        <textarea
          class="textarea"
          maxlength="200"
          name="info"
          {if condition="$shop.status eq 0"}  readonly="readonly" {/if}
          placeholder="您输入您要反馈的内容"
        >
{$shop.info}</textarea
        >
        <div class="numBox"></div>
      </div>
    </div>
  </div>
  <div class="huidiv20"></div>
  <div class="DmBtn Mt70">
    {if condition="$shop.id eq 0"}
    <input
            class="gradualBg u-high"
            id="gradualBgnew"
            type="button"
            value="立即开通"
    />
    {else }
      {if condition="$shop.status eq 2"}
      <input
        class="gradualBg u-high"
        id="gradualBgnew"
        type="button"
        value="立即更新"
      />

      {/if}
    {/if}
  </div>
</div>

<div class="CommonMain" id="CommonMain1" style="display: none">
  <div>
    <div class="UpImg">
      <div class="title">上传身份证</div>
      <div class="am-cf">
        <div class="kutup am-fl">
          <img
            class="inp1"
            id="img_41"
            width="100%"
            onclick="return ajaxFileUpload();"
            src="__CDN__{$shop.user_card_on}"
          />


          {if condition="$shop.id eq 0"}
          <input
                  type="file"
                  id="inp1"
                  multiple="multiple"
                  name="file"
                  value=""
                  accept="image/*" />
          {else }
          {if condition="$shop.status eq 2"}
          <input
                  type="file"
                  id="inp1"
                  multiple="multiple"
                  name="file"
                  value=""
                  accept="image/*" />

          {/if}
          {/if}



          <p>上传身份证正面</p>
        </div>
        <div class="kutup  am-fl">
          <img
            class="inp2"
            id="img_42"
            width="100%"
            src="__CDN__{$shop.user_card_back}"
          />

          {if condition="$shop.id eq 0"}
          <input type="file" id="inp2" multiple="multiple" name="file" accept="image/*" />
          {else }
          {if condition="$shop.status eq 2"}
          <input type="file" id="inp2" multiple="multiple" name="file" accept="image/*" />

          {/if}
          {/if}



          <p>上传身份证反面</p>
        </div>
      </div>
    </div>
    <div class="UpImg">
      <div class="am-cf">
        <div class="kutup am-fl">
          <div class="title">上传营业执照</div>
          <img
            class="inp3"
            id="img_43"
            width="100%"
            src="__CDN__{$shop.license}"
          />

          {if condition="$shop.id eq 0"}
          <input type="file" multiple="multiple" name="file" id="inp3" accept="image/*" />
          {else }
          {if condition="$shop.status eq 2"}
          <input type="file" multiple="multiple" name="file" id="inp3" accept="image/*" />

          {/if}
          {/if}


        </div>
        <div class="kutup am-fl">
          <div class="title">商户主图</div>
          <img
            class="inp3"
            id="img_44"
            width="100%"
            src="__CDN__{$shop.shop_image}"
          />

          {if condition="$shop.id eq 0"}
          <input type="file" multiple="multiple" name="file" id="inp4" accept="image/*" />
          {else }
          {if condition="$shop.status eq 2"}
          <input type="file" multiple="multiple" name="file" id="inp4" accept="image/*" />

          {/if}
          {/if}
        </div>
      </div>
    </div>
  </div>
  <div class="DmBtn Mt70">
    {if condition="$shop.id eq 0"}
    <input class="gradualBg" type="button" value="保存" />
    {else }
    {if condition="$shop.status eq 2"}
    <input class="gradualBg" type="button" value="保存" />

    {/if}
    {/if}



  </div>
</div>
<div
  class="am-modal am-modal-loading am-modal-no-btn"
  tabindex="-1"
  id="my-modal-loading"
>
  <div class="am-modal-dialog">
    <div class="am-modal-hd" style="font-size: 2.4em;">正在载入...</div>
    <div class="am-modal-bd">
      <span
        class="am-icon-spinner am-icon-spin"
        style="font-size: 1.8em"
      ></span>
    </div>
  </div>
</div>
<script>
  // ShowImage()
</script>

<!--<script src="__CDN__/assets/js/ajaxfileupload.js"></script>-->
<!--<script src="http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.min.js" type="text/javascript"></script>-->
<script src="__CDN__/assets/js/LocalResizeIMG.js"></script>
<script src="__CDN__/assets/js/mobileBUGFix.mini.js"></script>
<!--<script src="__CDN__/assets/js/upload.js"></script>-->

<script type="text/javascript">

    var is_v = 0
  function onc() {
    if (is_v == 0) {
      javascrpit: history.go(-1)
    } else if (is_v == 1) {
      $("#CommonMain1").css("display", "none")
      $("#CommonMain2").css("display", "block")
      is_v = 0
    }
  }

  // 监听输入设置是否高亮
  $("input").on("input", function() {
    let desc = $("input[name=desc]").val() > 0
    let name = $("input[name=name]").val() > 0
    if (desc && name) {
      $("#gradualBg").addClass("u-high")
    } else {
      $("#gradualBg").removeClass("u-high")
    }
  })
  $("#gradualBgnew").on("click", function() {
    var name = $("input[name='name']").val()
    var category_id = $("select[name='category_id']").val()
    var user_card_on = $("input[name='user_card_on']").val()
    var user_card_back = $("input[name='user_card_back']").val()
    var license = $("input[name='license']").val()
    var province = $("select[name='province']").val()
    var city = $("select[name='city']").val()
    var area = $("select[name='area']").val()
    var address = $("input[name='address']").val()
    var desc = $("input[name='desc']").val()
    var shop_image = $("input[name='shop_image']").val()
    var info = $("textarea[name='info']").val()
    var shop_id = $("input[name='shop_id']").val()
    $.ajax({
      type: "POST",
      url: "{$http_url}/index/user/business",
      dataType: "json",
      data: {
        name: name,
        category_id: category_id,
        user_card_on: user_card_on,
        user_card_back: user_card_back,
        license: license,
        province: province,
        city: city,
        area: area,
        address: address,
        desc: desc,
        shop_image: shop_image,
        info: info,
        shop_id: shop_id
      },
      success: function(data) {
        if (data.code > 0) {
          alert(data.msg)
          javascript:history.go(-1)
        } else {
          $("input[name='__token__']").val(data.token)
          alert(data.msg)
        }
      },
      error: function(jqXHR) {
        console.log("Error: " + jqXHR.status)
      }
    })
  })

  $("#addarea_sheng").change(function() {
    var provid = $("#addarea_sheng").val()
    $.get("{:url('user/getRegion')}?pid=" + provid + "&ajax=1", function(data) {
      $("#addarea_shi").show(0, function() {
        $(this).html(data)
      })
    })
  })

  $("#addarea_shi").change(function() {
    var provid = $("#addarea_shi").val()
    $.get("{:url('user/getRegion')}?pid=" + provid + "&ajax=1", function(data) {
      $("#addarea_quxian").show(0, function() {
        $(this).html(data)
      })
    })
  })
  $("#cok").on("click", function() {
    is_v = 1
    $("#CommonMain1").css("display", "block")
    $("#CommonMain2").css("display", "none")
  })
  $(".gradualBg").on("click", function() {
    $("#CommonMain1").css("display", "none")
    $("#CommonMain2").css("display", "block")
    is_v = 0
  })

    $('#inp1').localResizeIMG({
        width: 640,
        quality: 100,
        //before: function (that, blob) {},
        success: function (result) {
            var img = new Image();
            img.src = result.base64;
            // $('body').append(img);
            $("#my-modal-loading").modal()

            $.ajax({
                url : '{$http_url}/api/common/uploadBase64',
                type : "POST",
                data : {file:img.src },
                dataType:"json",

                success:function(data){

                    if(data.code == 1) {
                        $("input[name='user_card_on']").val(data.data.url)
                        $("#img_41").attr("src", data.data.url)
                        $("#my-modal-loading").modal("close")

                    }else {
                        $("#my-modal-loading").modal("close")
                        alert(data.msg);
                    }
                }
            });


        }
    });




    $('#inp2').localResizeIMG({
        width: 640,
        quality: 100,
        //before: function (that, blob) {},
        success: function (result) {
            var img = new Image();
            img.src = result.base64;
            // $('body').append(img);
            $("#my-modal-loading").modal()

            $.ajax({
                url : '{$http_url}/api/common/uploadBase64',
                type : "POST",
                data : {file:img.src },
                dataType:"json",

                success:function(data){

                    if(data.code == 1) {
                        $("input[name='user_card_back']").val(data.data.url)
                        $("#img_42").attr("src", data.data.url)
                        $("#my-modal-loading").modal("close")

                    }else {
                        $("#my-modal-loading").modal("close")
                        alert(data.msg);
                    }
                }
            });


        }
    });

    $('#inp3').localResizeIMG({
        width: 640,
        quality: 100,
        //before: function (that, blob) {},
        success: function (result) {
            var img = new Image();
            img.src = result.base64;
            // $('body').append(img);
            $("#my-modal-loading").modal()

            $.ajax({
                url : '{$http_url}/api/common/uploadBase64',
                type : "POST",
                data : {file:img.src },
                dataType:"json",

                success:function(data){

                    if(data.code == 1) {
                        $("input[name='license']").val(data.data.url)
                        $("#img_43").attr("src", data.data.url)
                        $("#my-modal-loading").modal("close")

                    }else {
                        $("#my-modal-loading").modal("close")
                        alert(data.msg);
                    }
                }
            });


        }
    });


    $('#inp4').localResizeIMG({
        width: 640,
        quality: 100,
        //before: function (that, blob) {},
        success: function (result) {
            var img = new Image();
            img.src = result.base64;
            // $('body').append(img);
            $("#my-modal-loading").modal()

            $.ajax({
                url : '{$http_url}/api/common/uploadBase64',
                type : "POST",
                data : {file:img.src },
                dataType:"json",

                success:function(data){

                    if(data.code == 1) {
                        $("input[name='shop_image']").val(data.data.url)
                        $("#img_44").attr("src", data.data.url)
                        $("#my-modal-loading").modal("close")

                    }else {
                        $("#my-modal-loading").modal("close")
                        alert(data.msg);
                    }
                }
            });


        }
    });
</script>
